<template>
    <dd-tab class="my-tab" @change="(i) => (index = i)">
        <dd-item>item-1</dd-item>
        <dd-item>item-2</dd-item>
        <dd-item>item-3</dd-item>
    </dd-tab>
    cuurent-index: {{ index }}
</template>
<script setup>
import { ref } from "vue";

const index = ref();
</script>
<style>
.my-tab {
    --nav-item-gap: 1em;
    --nav-item-padding: 0.5em 1em;
}
</style>
